import { Button } from "antd";
import './About.css'
import { useNavigate } from "react-router-dom";

export default function About() {
    const navigate = useNavigate();

    const handleGoHome = () => {
        navigate('/');
    }

    return (
        <div id="about">
            <div className="description">
                <div className="description-title">关于AI提示词生成器</div>
                <div className="description-content">
                    这是一个为AI爱好者打造的提示词优化工具，帮助您快速创建高质量的AI交互提示词
                </div>

                <div className="creator-info">
                    <p>作者：高桥凉介</p>
                    <p>开发日期：{new Date().toLocaleDateString()}</p>
                </div>

                <div className="maker">
                    <div className="description-content">
                        <h3>为什么开发这个项目？</h3>
                        <div className="maker-content">
                            <p>在使用AI工具时，我自己经常懒得优化提示词，</p>
                            <p>搜索网络上的现成工具后发现没有真正好用的AI提示词生成工具，</p>
                            <p>GitHub和Gitee上也没有符合我需求的解决方案，</p>
                            <p>于是决定自己开发这个工具。</p>
                        </div>
                    </div>

                    <div className="note">
                        <p>备注：本工具完全免费，因此生成提示词时可能需要6-10秒的等待时间。</p>
                        <p>感谢您的理解与支持！</p>
                    </div>
                </div>

                <div className="button-group">
                    <Button type="primary" onClick={handleGoHome}>返回首页</Button>
                </div>
            </div>
        </div>
    )
}
